
<template>
  <div class="deptTvmPiaoKuanCYTZ">
    <basic-container>
      <avue-crud
        ref="deptTvmPiaoKuanCYTZ"
        :option="option"
        :table-loading="listLoading"
        :data="list"
        :page.sync="page"
        @search-change="handleFilter"
        @selection-change="selectionChange"
        @refresh-change="getList"
        @on-load="getList">
        <template slot-scope="scope" slot="menuRight">

        </template>
        <template slot-scope="scope" slot="lineCodeSearch">
          <el-select v-model="searchForm.lineCode" placeholder="请选择" style="width: 150px" @change="changeLine" clearable filterable>
            <el-option
              v-for="(item,index) in lineCodes"
              :key="index"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </template>
        <template slot-scope="scope" slot="stationCodeSearch">
          <el-select v-model="searchForm.stationCode" placeholder="请选择" style="width: 150px" clearable @change="changeStation" filterable>
            <el-option
              v-for="(item,index) in stationCodes"
              :key="index"
              :label="item.name"
              :value="item.code">
            </el-option>
          </el-select>
        </template>
        <template slot-scope="scope" slot="conductorPersonNameSearch">
          <el-select v-model="searchForm.conductorPersonName" placeholder="请选择" style="width: 150px" filterable clearable>
            <el-option
              v-for="(item,index) in conductorPersonNames"
              :key="index"
              :label="item.nikename"
              :value="item.username">
            </el-option>
          </el-select>
        </template>
        <template slot-scope="scope" slot="search">
          <el-form-item label="差异条件" style="width: 150px" >
            <el-select v-model="searchForm.isDifferenceAmount" placeholder="请选择">
              <el-option label="长款" value="1"></el-option>
              <el-option label="短款" value="2"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="收入时间" style="width: 400px;margin-left: 30px">
            <div style="width: 300px;display: inline-flex">
              <el-date-picker
                v-model="searchForm.startTime"
                type="date"
                class="custom-date-picker"
                placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
              ~
              <el-date-picker
                v-model="searchForm.endTime"
                type="date"
                class="custom-date-picker"
                placeholder="选择日期"
                value-format="yyyy-MM-dd">
              </el-date-picker>
            </div>
          </el-form-item>

<!--          <el-form-item label="申诉日期" style="width: 400px;margin-left: 30px">-->
<!--            <div style="width: 300px;display: inline-flex">-->
<!--              <el-date-picker-->
<!--                v-model="searchForm.startSendTime"-->
<!--                type="date"-->
<!--                class="custom-date-picker"-->
<!--                placeholder="选择日期"-->
<!--                value-format="yyyy-MM-dd">-->
<!--              </el-date-picker>-->
<!--              ~-->
<!--              <el-date-picker-->
<!--                v-model="searchForm.endSendTime"-->
<!--                type="date"-->
<!--                class="custom-date-picker"-->
<!--                placeholder="选择日期"-->
<!--                value-format="yyyy-MM-dd">-->
<!--              </el-date-picker>-->
<!--            </div>-->
<!--          </el-form-item>-->
        </template>
        <template slot="searchMenu" slot-scope="{row,size}">
          <el-button :size="size" @click="()=>{setSearchFiledsEmpty(row);setSearchFiledsEmpty(searchForm)}" icon="el-icon-delete">清空</el-button>
        </template>
        <template slot-scope="scope" slot="menu">
          <el-button type="text" size="small"
                     plain @click.stop="previewOp(scope.row)">预览</el-button>
          <el-button type="text" size="small"
                     v-if="(scope.row.auditSate==5 || scope.row.auditSate==10) && permissionList.ticketAuditApprove"
                     plain @click.stop="ticketAuditApproveOption(scope.row)">审核通过</el-button><!-- 票务审核通过-->
          <el-button type="text" size="small"
                     v-if="(scope.row.auditSate==5 || scope.row.auditSate==10) && permissionList.ticketAuditReject"
                     plain @click.stop="ticketAuditReject(scope.row)">驳回</el-button><!-- 票务审核驳回-->
          <el-button type="text" size="small"
                     v-if="(scope.row.auditSate==7) && permissionList.departmentAuditApprove"
                     plain @click.stop="departmentAuditApproveOption(scope.row)">审核通过</el-button><!-- 部门审核通过-->
          <el-button type="text" size="small"
                     v-if="(scope.row.auditSate==7) && permissionList.departmentAuditReject"
                     plain @click.stop="departmentAuditReject(scope.row)">驳回</el-button><!-- 部门审核驳回-->
        </template>
      </avue-crud>
      <open-dialog
        :DialogVisible.sync="ticketAuditRejectShow"
        title="车间票务专业审核意见"
        width="60%"
      >
        <el-form v-if="ticketAuditRejectShow">
          <avue-form
            v-model="ticketAuditRejectForm"
            :option="ticketAuditRejectOption"></avue-form>
        </el-form>
        <div class="bottom-menu-invalid">
          <el-button type="primary" @click="subForm">保存</el-button>
          <el-button type="primary" @click="ticketAuditRejectShow = false" >取消</el-button>
        </div>
      </open-dialog>

      <open-dialog
        :DialogVisible.sync="ticketAuditRejectOptionShow"
        title="车间票务专业审核意见"
        width="60%"
      >
        <el-form v-if="ticketAuditRejectOptionShow">
          <avue-form
            v-model="ticketAuditRejectForm"
            :option="ticketAuditRejectOption"></avue-form>
        </el-form>
        <div class="bottom-menu-invalid">
          <el-button type="primary" @click="ticketAuditApprove">保存</el-button>
          <el-button type="primary" @click="ticketAuditRejectOptionShow = false" >取消</el-button>
        </div>
      </open-dialog>
      <open-dialog
        :DialogVisible.sync="departmentAuditRejectShow"
        title="部门票务专业审核意见"
        width="60%"
      >
        <el-form v-if="departmentAuditRejectShow">
          <avue-form
            v-model="departmentAuditRejectForm"
            :option="departmentAuditRejectOption"></avue-form>
        </el-form>
        <div class="bottom-menu-invalid">
          <el-button type="primary" @click="subDeptForm">保存</el-button>
          <el-button type="primary" @click="departmentAuditRejectShow = false" >取消</el-button>
        </div>
      </open-dialog>

      <open-dialog
        :DialogVisible.sync="departmentAuditRejectOptionShow"
        title="部门票务专业审核意见"
        width="60%"
      >
        <el-form v-if="departmentAuditRejectOptionShow">
          <avue-form
            v-model="departmentAuditRejectForm"
            :option="departmentAuditRejectOption"></avue-form>
        </el-form>
        <div class="bottom-menu-invalid">
          <el-button type="primary" @click="departmentAuditApprove">保存</el-button>
          <el-button type="primary" @click="departmentAuditRejectOptionShow = false" >取消</el-button>
        </div>
      </open-dialog>
      <prev ref="prev" v-if="prevDialogVisible"></prev>
    </basic-container>
  </div>

</template>

<script>
import {mapGetters} from 'vuex';
import moment from 'moment';
import prev from './prev';
import {ticketAuditRejectOption,departmentAuditRejectOption} from "@/const/crud/zhanNeiRYDLCK";
import {getLineCodes,
  getStationByCode, getSysUserToLS, setSearchFiledsEmpty
} from "@/api/subwayRat/commonCheck";
import {getDeptTvmPiaoKuanCYTZOption,
  getSwAuTvmNoticeList,
  auditSwAuTvmrNotice} from '@/api/subwayRat/swAuTvm/tvmCYQRTZ'
export default {
  name: 'deptTvmPiaoKuanCYTZ',
  components:{
    prev
  },
  data() {
    return {
      departmentAuditRejectForm: {},
      departmentAuditRejectShow: false,
      departmentAuditRejectOptionShow: false,
      ticketAuditRejectForm: {},
      ticketAuditRejectShow:false,
      ticketAuditRejectOptionShow: false,
      prevDialogVisible:false, //yulan
      option: {},
      listLoading: true,
      lineCodes:[],
      stationCodes:[],
      conductorPersonNames:[],
      selectKeys:[],
      selectKeyVals:[],
      searchForm:{
        lineCode:'9',
        stationCode:'',
        conductorPersonName:''},
      page: {
        total: 0, // 总页数
        currentPage: 1, // 当前页数
        pageSize: 20, // 每页显示多少条,
        isAsc: false// 是否倒序
      },
      param:{
        replyPeriod:"",//回复期限
        appealReply:'',//申诉回复
      },
      list : [],
      ticketAuditRejectOption: ticketAuditRejectOption,
      departmentAuditRejectOption: departmentAuditRejectOption
    }
  },
  computed: {
    ...mapGetters(['permissions']),
    permissionList () {
      return {
        ticketAuditApprove: this.vaildData(
          this.permissions.deptTvmPiaoKuanCYTZ_AUDIT_WORKSHOP_PASS,
          false
        ),
        ticketAuditReject: this.vaildData(
          this.permissions.deptTvmPiaoKuanCYTZ_AUDIT_WORKSHOP_REJECT,
          false
        ),
        departmentAuditApprove: this.vaildData(
          this.permissions.deptTvmPiaoKuanCYTZ_AUDIT_DEPT_PASS,
          false
        ),
        departmentAuditReject: this.vaildData(
          this.permissions.deptTvmPiaoKuanCYTZ_AUDIT_DEPT_REJECT,
          false
        ),
      };
    },
  },
  watch: {
  },
  created() {
    getStationByCode({line_code:'9'}).then(res=>{
      this.stationCodes=res.data;
      this.searchForm.stationCode='';
      this.searchForm.conductorPersonName = '';
    });
    this.option=getDeptTvmPiaoKuanCYTZOption();
  },
  methods: {
    setSearchFiledsEmpty,
    moment,
    getList() {
      this.listLoading = true;
      Object.assign(this.searchForm,this.page);
      this.searchForm.combinStatus=0;
      this.searchForm.sendStatus=2;
      getSwAuTvmNoticeList(this.searchForm).then((response)=>{
        this.list = response.data.data.list;
        this.listLoading = false;
        this.page.total=response.data.data.pageInfo.total;
      });
    },

    ticketAuditApprove(row){
      let th=this;
      if (this.ticketAuditRejectForm.auditWorkshopOpinion == null || this.ticketAuditRejectForm.auditWorkshopOpinion == '') {
        th.$message.error("请填写审核意见！");
        return false;
      }
      auditSwAuTvmrNotice({
        id:this.ticketAuditRejectForm.id,
        auditSate:7,
        auditWorkshopOpinion:this.ticketAuditRejectForm.auditWorkshopOpinion
      }).then(res=>{
        th.$message.success("票务审核成功！");
        this.ticketAuditRejectOptionShow=false;
        th.getList();
      })
        .catch(() => {
          // th.$message.error("票务审核失败！");
          return false;
        });
    },

    ticketAuditReject: function (row){
      this.ticketAuditRejectShow=true;
      this.ticketAuditRejectForm = row;
    },

    ticketAuditApproveOption: function (row){
      this.ticketAuditRejectOptionShow=true;
      this.ticketAuditRejectForm = row;
    },

    subForm(){
      let th=this;
      auditSwAuTvmrNotice({
        id:this.ticketAuditRejectForm.id,
        auditSate:8,
        auditWorkshopOpinion:this.ticketAuditRejectForm.auditWorkshopOpinion
      }).then(res=>{
        th.$message.success("票务审核成功！");
        this.ticketAuditRejectShow=false;
        th.getList();
      })
        .catch(() => {
          return false;
          // th.$message.error("票务审核失败！");
        });
    },

    departmentAuditApprove(row){
      let th=this;
      if (this.departmentAuditRejectForm.auditDeptOpinion == null || this.departmentAuditRejectForm.auditDeptOpinion == '') {
        th.$message.error("请填写审核意见！");
        return false;
      }
      auditSwAuTvmrNotice({
        id:this.departmentAuditRejectForm.id,
        auditSate:9,
        auditDeptOpinion:this.departmentAuditRejectForm.auditDeptOpinion
      }).then(res=>{
        th.$message.success("部门审核成功！");
        this.departmentAuditRejectOptionShow=false;
        th.getList();
      })
        .catch(() => {
          // th.$message.error("部门审核失败！");
          return false;
        });
    },

    departmentAuditReject: function (row){
      this.departmentAuditRejectShow=true;
      this.departmentAuditRejectForm = row;
    },

    departmentAuditApproveOption: function (row){
      this.departmentAuditRejectOptionShow=true;
      this.departmentAuditRejectForm = row;
    },

    subDeptForm(){
      let th=this;
      auditSwAuTvmrNotice({
        id:this.departmentAuditRejectForm.id,
        auditSate:10,
        auditDeptOpinion:this.departmentAuditRejectForm.auditDeptOpinion
      }).then(res=>{
        th.$message.success("部门审核成功！");
        this.departmentAuditRejectShow=false;
        th.getList();
      })
        .catch(() => {
          // th.$message.error("部门审核失败！");
          return false;
        });
    },

    previewOp(row){
      this.prevDialogVisible=true;
      this.$nextTick(()=>{
        this.$refs.prev.dialogVisible=true;
        this.$refs.prev.recallShow(row,this);
      })
    },
    selectionChange(list){
      this.selectKeys=list;
      this.selectKeyVals=[];
      for(let i=0;i<list.length;i++){
        this.selectKeyVals.push(list[i].id);
      }
    },
    handleFilter(params, done) {
      Object.assign(this.searchForm,params);
      this.getList()
      done()
    },

    changeLine(v){ //改变线路时
      getStationByCode({line_code:v}).then(res=>{
        this.stationCodes=res.data;
        this.searchForm.stationCode='';
        this.searchForm.conductorPersonName = '';
        //this.conductorPersonNames = [];
      });

      /*getSysUserToLS({lineCode:v}).then((res)=>{
        this.conductorPersonNames=res.data.data;
      });*/
    },
    changeStation(v){
      getSysUserToLS({stationCode:v}).then((res)=>{
        this.conductorPersonNames=res.data.data;
        this.searchForm.conductorPersonName = '';
      });
    },

  },
  mounted() {
    // getLineAllAsyn().then(res=>{ //获取线路
    //   this.lineCodes=res.data;
    // });
    getLineCodes().then(res=>{ //获取线路
      this.lineCodes=res;
    });
  }
}
</script>
<style lang="scss">
.huLianWangShouPiaojiDataInput {
  height: 100%;

  &__tree {
    padding-top: 3px;
    padding-right: 20px;
  }

  &__main {
    .el-card__body {
      padding-top: 0;
    }
  }
  .avue-form__group{

  }
}
.custom-date-picker .el-input__inner {
  width: 150px; /* 设置你想要的宽度 */
}
</style>
